<form method="post" enctype="multipart/form-data">
                <!--h1 class="text-center">Ajouter des produits</h1-->
                <hr>
                <div class="info_perso">
                    <!--div class="ttle1e"><h3>Informations personnelles</h3></div-->
                    <div class="inputs">
                        <!--div class="input-container">
                            <span class="custom-checkbox"> 
                                <label class="label" for="nom_user">Titre</label>
                                <input name="id_gender" type="radio">
                                <input name="id_gender" type="radio">
                            </span>
                        </div-->
                        <div class="input-container">
                            <input type="text" id="nom_user" name="nom_user" class="text-input" autocomplete="off" placeholder="Enter your surname" required />
                            <label class="label" for="nom_user">Nom</label>
                        </div>
                        <div class="input-container">
                            <input type="text" id="prenom_user" name="prenom_user" class="text-input" autocomplete="off" placeholder="Enter your name" required />
                            <label class="label" for="prenom_user">Prenom</label>
                        </div>
                        <div class="input-container">
                            <input type="date" id="datenaissance_user" name="datenaissance_user" class="text-input" required />
                        </div>
                        <div class="input-container container1">
                            <input type="radio" name="sexe_user" id="homme" value="Homme">
                            <label for="homme"><i class="fa-solid fa-person"></i></label>
                            <!--i class="fa-solid fa-person"></i-->
                            <br>
                            <input type="radio" name="sexe_user" id="femme" value="Femme">
                            <label for="femme"><i class="fa-solid fa-person-dress"></i></label>
                            <!--i class="fa-solid fa-person-dress"></i-->
                        </div>
                        <div class="input-container">
                            <input type="number" id="numtel_user" name="numtel_user" class="text-input" autocomplete="off" placeholder="Enter your phone number" required />
                            <label class="label" for="numtel_user">N° Telephone</label>
                        </div>
                        <div class="input-container">
                            <input type="text" id="pseudo_user" name="pseudo_user" class="text-input" autocomplete="off" placeholder="Enter your Pseudo" required />
                            <label class="label" for="pseudo_user">Pseudo</label>
                        </div>
                        <div class="input-container">
                            <input type="mail" id="email_user" name="email_user" class="text-input" autocomplete="off" placeholder="Enter your Email" required />
                            <label class="label" for="email_user">Email</label>
                        </div>
                        <div class="passwd-container">
                            <div class="input-container">
                            <input type="password" id="password_user" name="password_user" class="pass-input" autocomplete="off" placeholder="Enter your Mot de passe" required />
                            <label class="label" for="password_user">Mot de passe</label>
                            <i class="fa-solid fa-eye" id="eye"></i>
                            </div>
                            <div class="pass-strength">
                                <div class="strength-percent"><span></span></div>
                                <span class="strength-label"></span>
                            </div>
                        </div>
                        <div class="passwd-container">
                            <div class="input-container">
                            <input type="password" id="password_retype" name="password_retype" class="pass-input" autocomplete="off" placeholder="Re-tapez le Mot de passe" required />
                            <label class="label" for="password_retype">Confirmez le Mot de passe</label>
                            <!--i class="fa-solid fa-eye"></i-->
                            </div>
                            <!--div class="pass-strength">
                                <div class="strength-percent"><span></span></div>
                                <span class="strength-label"></span>
                            </div-->
                        </div>
                    </div>
                </div>
                <hr>
                <div class="input-btn">
                    <!--input type="submit" class="button-input" placeholder="Submit" required /-->
                    <button placeholder="Submit" class="button-input" name="Submit">Continuer</button>
                </div>
            </form>
    <script>
        const fileInput = document.querySelector("#fileInput");
        const icon = document.querySelector(".icon");
        const fileNameElement = document.querySelector("#fileName");
    
        fileInput.addEventListener('change', function () {
            const files = fileInput.files;
            if (files.length > 0) {
                const fileName = files[0].name;
                fileNameElement.innerHTML = fileName;
                icon.innerHTML = "download_done";
            } else {
                fileNameElement.innerHTML = 'Aucun fichier sélectionné';
                icon.innerHTML = "cloud_upload"; // Efface l'icône s'il n'y a pas de fichier sélectionné
            }
        });
    </script>







